<template>
    <div>
        <!--<div style="margin-bottom:15px">-->
            <!--<el-button-->
                    <!--slot="addOrder"-->
                    <!--style="background: rgb(7, 131, 241);color: #fff"-->
                    <!--@click="$router.push('addexapply')"-->
            <!--&gt;-->
                <!--样品申请-->
            <!--</el-button>-->
        <!--</div>-->
        <div class="searchArea flex">
            <el-form ref="serachForm"
                     :model="searchForm"
                     :inline="true"
                     style="width:98%"
                     label-position="left"
                     label-width="90px">

                <el-form-item label="编号" prop="code" style="width:30%" >
                    <el-input v-model="searchForm.recordNum" placeholder="请输入编号"  ></el-input>
                    <!--:disabled="isDisabled"-->
                </el-form-item>
                <!--<el-form-item label="是否审批"-->
                <!--prop="isHandle">-->
                <!--<el-switch-->
                <!--v-model="searchForm.statusList"-->
                <!--active-text="已审批"-->
                <!--inactive-text="未审批">-->
                <!--</el-switch>-->
                <!--</el-form-item>-->



                <el-form-item prop="searchForm" label="状态:">
                    <el-select v-model="searchForm.status" filterable placeholder="请选择" >
                        <el-option
                                v-for="item in categroyList"
                                :label="item.cateName"
                                :value="item.id"
                                :key="item.id"
                        ></el-option>
                    </el-select>
                </el-form-item>


                <el-form-item prop="action" >
                    <el-button type='primary'
                               @click="searchSubmit">搜索</el-button>
                    <el-button type="primary"
                               style="margin:0,15px"
                               @click="dialogDetailFormVisible=true">导出</el-button>
                </el-form-item>
            </el-form>
        </div>
        <div class="applicationList">
            <el-table :data="tableData" style="width: 100%" height="500" stripe>
                <el-table-column prop="recordNum" label="免费样品订单编号" align="center"></el-table-column>
                <el-table-column prop="from" label="来源类别" align="center"></el-table-column>
                <el-table-column prop="askAccount" label="申请账户" align="center"></el-table-column>
                <el-table-column prop="createTime" label="申请时间" align="center">
                    <template slot-scope="scope">
                        <label>{{scope.row.createTime  | formatDate}}</label>
                    </template>
                </el-table-column>
                <el-table-column prop="status" label="状态"  align="center"></el-table-column>
                <el-table-column label="操作"  align="center" fixed="right" width="180">
                    <template slot-scope="scope" >
                        <el-button type="primary"    size="mini" @click="detail(scope.row)">详情</el-button>
                        
                        <el-button type="primary"  size="mini" v-if="scope.row.changeDeliveryFlag == 1" @click="sendStyle(scope.row)">发货方式</el-button>
                       

                    </template>
                </el-table-column>-->
            </el-table>
            <el-pagination
                    style="text-align:right;margin-top:20px"
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="currentPage"
                    :page-sizes="[5, 10, 15, 20]"
                    :page-size="pageSize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="total"
            ></el-pagination>
        </div>
        <!--发货方式-->
        <el-dialog  class="sendstyle" title="发货方式" :visible.sync="sendStyles_show">
        <el-form :model="sendStyles">
        <el-form-item label="发货方式">
            <el-radio-group v-model="sendStyles.deliverySide">
            <el-radio label="2">制造商直出</el-radio>
            <el-radio disabled label="1">鸿芯优电上海仓</el-radio>
            </el-radio-group>
        </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button size="mini" @click="sendStyles_show = false">取 消</el-button>
            <el-button size="mini" type="primary" @click="gosendStyle">确 定</el-button>
        </div>
        </el-dialog>
        <!-- 导出 -->
        <el-dialog title="导出" :visible.sync="dialogDetailFormVisible">
            <el-form :model="downLoadForm">


                <el-form-item label="创建时间">
                    <!--prop="timeRange">-->
                    <el-date-picker v-model="timeRange"
                                    clearable
                                    type="daterange"
                                    range-separator="至"
                                    start-placeholder="开始日期"
                                    end-placeholder="结束日期"></el-date-picker>
                </el-form-item>

                <el-form-item prop="searchForm" label="状态" style="margin-left:23px">
                    <el-select v-model="searchForm.status" filterable placeholder="请选择">
                        <el-option
                                v-for="item in categroyList"
                                :label="item.cateName"
                                :value="item.id"
                                :key="item.id"
                        ></el-option>
                    </el-select>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="dialogDetailFormVisible = false">取 消</el-button>
                <el-button type="primary" @click="daochu">确 定</el-button>
            </div>
        </el-dialog>

    </div>
</template>

<script>
    import { SAMPLE_MY_LIST,BELONGMENULIST,download1,SENDSTYLE } from '@/utils/api';
    import search from "@/components/search.vue";
    import { formatDate } from '@/utils/validate.js';
    import { Message } from 'element-ui'
    export default {
        components: { search },
        data() {
            return {
                style:'',
                sendStyles_show : false,
                sendStyles:{
                	deliverySide:-1
                },
                categroyList: [
                    {id:'0,1,2,4',cateName:"全部"},
                    {id:'1,4',cateName:"已审批"},
                    {id:2,cateName:"已婉拒"},
                    {id:0,cateName:"待审批"}
                ],
                shopType:[

                    {value:1,text:"已提交审核 "},
                    {value:2,text:"待发货"},
                    {value:3,text:"已婉拒"},
                    {value:4,text:"已发货完成"}
                ],
                timeRange:'',
                downLoadForm:{},
                dialogDetailFormVisible:false,
                searchForm: {
                    customerName: "",
                    materialNo: "",
                    applicant: "",
                    timeRange: [],
                    status: "",
                    statusList:false
                },
                tableData: [

                ],
                downloadUrl:"https://yzbban.oss-cn-shanghai.aliyuncs.com/",
                currentPage: 1,
                pageSize: 10,
                total: 50,
                range:2
            };
        },
        created(){
            this.belongMenuMainList()
            // this.getSampleMyList()
        },
        filters: {
            formatDate(time) {
                var date = new Date(time*1000);
                return formatDate(date, 'yyyy-MM-dd hh:mm:ss');
            }
        },
        methods: {
            //发货方式
            sendStyle(row){
            this.sendStyles_show  = true
            this.recordmainId = row.id
            this.style = row.deliverySide
            if(this.style == 1){
                this.sendStyles.deliverySide = "1"
            }else if(this.style == 2) {
                this.sendStyles.deliverySide = "2"
            }
            },
                //提交发货方式
            gosendStyle(){

            SENDSTYLE({
                    deliverySide: this.sendStyles.deliverySide,
                    recordmainId: this.recordmainId,
                }).then(res => {
                        Message.success({ message: "提交成功" });
                        this.sendStyles_show  = false
                         this.belongMenuMainList()
                })

            console.log(this.sendStyles)
            },

            daochu(){
                console.log(999)
                console.log(this.searchForm.status)
                download1({
                    statusList: this.searchForm.status,
//                  from:0,
                    range: 2,
                    startTime: new Date(this.timeRange[0]).getTime()/1000,
                    endTime:new Date(this.timeRange[1]).getTime()/1000,
                }).then(res => {
                    console.log(res.data)
                    var url = this.downloadUrl + res.data;
                    location.href = url;
                })
            },
            belongMenuMainList(){
                let token = sessionStorage.getItem('op-token')
                console.log(token)
                BELONGMENULIST({
                    pageNo: this.currentPage,
                    pageSize: this.pageSize,
                    range:this.range,
                    from:1
                }).then(res => {
                
                    this.tableData=res.data.dataList
                    this.total = res.data.count
                    let datacount = res.data.count
                    let i = 0;
                    for (i = 0; i < datacount; i++) {

                        if(this.tableData[i].from  == 0){
                            this.tableData[i].from ='aml'
                        }
                        if(this.tableData[i].from  == 1){
                            console.log(987)
                            this.tableData[i].from ='商城申请 '
                        }


                        if(this.tableData[i].status == 0){
                            this.tableData[i].status ='已提交审核，原厂审核中'
                        }
                        if(this.tableData[i].status == 1){
                            this.tableData[i].status ='已审核'
                        }
                        if(this.tableData[i].status == 2){
                            this.tableData[i].status ='已婉拒'
                        }
                        if(this.tableData[i].status == 3){
                            this.tableData[i].status ='待发货'
                        }
                        if(this.tableData[i].status == 4){
                            this.tableData[i].status ='待收货'
                        }
                        if(this.tableData[i].status == 5){
                            this.tableData[i].status ='待评价 '
                        }
                    }
                })
            },

            searchSubmit(){
                let token = sessionStorage.getItem('op-token')

                BELONGMENULIST({
                    pageNo: this.currentPage,
                    pageSize: this.pageSize,
                    range:this.range,
                    recordNum:this.searchForm.recordNum,
                    statusList:this.searchForm.status,
                }).then(res => {
                    this.tableData=res.data.dataList
                    let datacount = res.data.count
                    let i = 0;
                    for (i = 0; i < datacount; i++) {

                        if(this.tableData[i].from  == 0){
                            this.tableData[i].from ='aml'
                        }
                        if(this.tableData[i].from  == 1){
                            console.log(987)
                            this.tableData[i].from ='商城申请 '
                        }

                        this.tableData[i].oldstatus = this.tableData[i].status
                        if(this.tableData[i].status == 0){
                            this.tableData[i].status ='已提交审核，原厂审核中'
                        }
                        if(this.tableData[i].status == 1){
                            this.tableData[i].status ='已审核'
                        }
                        if(this.tableData[i].status == 2){
                            this.tableData[i].status ='已婉拒'
                        }
                        if(this.tableData[i].status == 3){
                            this.tableData[i].status ='待发货'
                        }
                        if(this.tableData[i].status == 4){
                            this.tableData[i].status ='待收货'
                        }
                        if(this.tableData[i].status == 5){
                            this.tableData[i].status ='待评价 '
                        }
                    }
                })
            },
            detail(row){
                console.log(row)
                this.$router.push({
                    path: "exorderDetail2",
                    query: {
                        data: row,
                        handler: "check"
                    }
                });
            },
            search() {},
            // getSampleMyList(){
            //   console.log('==getSampleMyList==>')
            //   SAMPLE_MY_LIST({
            //       pageNo: this.currentPage,
            //       pageSize: this.pageSize
            //   }).then(res => {
            //       this.loading = false
            //       this.tableData = res.data.dataList
            //       this.total = res.data.count
            //   })
            // },
            // 订单状态格式化
            formatStatus(row, column) {
                var status = row[column.property]
                switch(status) {
                    case 0: return '已提交审核，原厂审核中'
                    case 1: return '已审核'
                    case 2: return '已婉拒'
                    case 3: return '待发货'
                    case 4: return '待收货'
                    case 5: return '待评价'
                }
            },
            checkTransport(row, index) {
                this.$router.push('transportation')
            },
            modifyOrder(row, index) {
                this.$router.push({
                    name: "handleOrder",
                    params: {
                        orderIndo: row
                    }
                });
            },
            handleSizeChange(val) {
                 this.pageSize=val
                 this.belongMenuMainList();
                console.log(`每页 ${val} 条`);
            },
            handleCurrentChange(val) {
                    // console.log(`当前页: ${val}`);
                console.log(val)
                this.currentPage=val
                this.belongMenuMainList()
            }
        }
    };
</script>

<style lang="scss" scoped>
    .applicationList {
        width: 100%;
        background: #fff;
        padding: 20px 2px;
        border-radius: 5px;
        box-shadow: 2px 3px 15px 0 #ccc;
    }
    .searchArea {
        width: 100%;
        margin-top: 15px;
        justify-content: flex-start;
    }
    .sendstyle{
    width: 800px;
    margin: 0 auto;
    
  }
</style>